<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt"  prefix="fmt"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<base href="<%=basePath%>">
<title>查询商品列表</title>
<style type="text/css">
	.goods td{
		width:200px;
		text-align: center;
	}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<script type="text/javascript">
 	//时间转换函数
	function getMyDate(str){  
	    var oDate = new Date(str),  
	    oYear = oDate.getFullYear(),  
	    oMonth = oDate.getMonth()+1,  
	    oDay = oDate.getDate(),  
	    oTime = oYear +'-'+ getzf(oMonth) +'-'+ getzf(oDay);//最后拼接时间  
	    return oTime;  
	};  
	//补0操作  
	function getzf(num){  
	    if(parseInt(num) < 10){  
	        num = '0'+num;  
	    }  
	    return num;  
	}  
	$(document).ready(function(){
		//页面加载时查询所有数据
		$.post("findAllItems.action",{},
	  			  function(data,status){  
					$("#goodslist").html("");
	  				$.each(data,function(index,Items){
	  					$("#goodslist").append("<tr><td>"+Items.name+"</td><td>"+Items.price
	  	  	  					+"</td><td>"+getMyDate(Items.createtime)+"</td><td>"
	  	  	  					+Items.detail+"</td>"
	  	  	  					+"<td><a href=\"toChange.action?id="+Items.id+"\">修改</a>&nbsp;<a href=\"deleteItems.action?id="+Items.id+"\">删除</a></td></tr>");
	  	  						$("tr:even").css("background-color","#B2E0FF");
	  				});				 
	  			});  
	 	$("tr:odd").css("background-color","#B2E0FF");
	 	//搜索按钮点击事件，若搜索框为空则查询所有制，否则按搜索框输入的查询
	 	$("#search").click(function(){
	 		var nameinfo = $("#pname").val();
	 		if(nameinfo == ""){
	 			$.post("findAllItems.action",{},
	 		  			  function(data,status){  
	 						$("#goodslist").html("");
	 		  				$.each(data,function(index,Items){
	 		  					$("#goodslist").append("<tr><td>"+Items.name+"</td><td>"+Items.price
	 		  	  	  					+"</td><td>"+getzf(getMyDate(Items.createtime))+"</td><td>"
	 		  	  	  					+Items.detail+"</td>"
	 		  	  	  					+"<td><a href=\"toChange.action?id="+Items.id+"\">修改</a>&nbsp;<a href=\"deleteItems.action?id="+Items.id+"\">删除</a></td></tr>");
	 		  	  						$("tr:even").css("background-color","#B2E0FF");
	 		  				});				 
	 		  			});  
	 		}else{
	 			$.ajax({
	  				type:'post',
	  				url:'findNameItems.action',
	  				contentType:'application/json;charset=UTF-8',
	  				data:'{"name":"'+nameinfo+'"}',
	  				success: function(data){
	  					$("#goodslist").html("");
	  					$.each(data,function(index,Items){
	  						$("#goodslist").append("<tr><td>"+Items.name+"</td><td>"+Items.price
		  	  	  					+"</td><td>"+getzf(getMyDate(Items.createtime))+"</td><td>"
		  	  	  					+Items.detail+"</td>"
		  	  	  					+"<td><a href=\"toChange.action?id="+Items.id+"\">修改</a>&nbsp;<a href=\"deleteItems.action?id="+Items.id+"\">删除</a></td></tr>");
		  	  						$("tr:even").css("background-color","#B2E0FF");
	  	  				});				 
	  				}
	  			});	
	 		}	
        });
	});
</script>
<body> 
查询条件：
<input type="text" id="pname">&nbsp;<input type="button" id="search" value="查询"/><br>
商品列表：<a href="add.jsp">新增商品</a><br><hr>
<table class="goods">
<tr>
	<td>商品名称</td>
	<td>商品价格</td>
	<td>生产日期</td>
	<td>商品描述</td>
	<td>操作</td>
</tr>
</table>
<table class="goods" id="goodslist">
</table>
</body>

</html>